Component({
  options: {
    multipleSlots: true // 在组件定义时的选项中启用多slot支持
  },
  /**
   * 组件的属性列表
   */
  properties: {
    extClass: {
      type: String,
      value: ''
    },
    theme: {
      type: String,
      value: ''
    },
    isSeat: {
      type: Boolean,
      value: true
    },
    title: {
      type: String,
      value: ''
    },
    background: {
      type: String,
      value: 'transparend'
    },
    color: {
      type: String,
      value: '#000'
    },
    back: {
      type: Boolean,
      value: true
    },
    loading: {
      type: Boolean,
      value: false
    },
    showIcon: {
      type: Boolean,
      value: true
    },
    animated: {
      // 显示隐藏的时候opacity动画效果
      type: Boolean,
      value: true
    },
    show: {
      // 显示隐藏导航，隐藏的时候navigation-bar的高度占位还在
      type: Boolean,
      value: true,
      observer: '_showChange'
    },
    // back为true的时候，返回的页面深度
    delta: {
      type: Number,
      value: 1
    }
  },
  /**
   * 组件的初始数据
   */
  data: {
    imgUri: getApp().globalData.imgUri,
    displayStyle: '',
    statusBarHeight: 20,
    isShowHome: false
  },
  attached() {
    // 获取菜单按钮（右上角胶囊按钮）的布局位置信息。坐标信息以屏幕左上角为原点。
    const rect = wx.getMenuButtonBoundingClientRect()
    // console.log('右上角胶囊按钮）布局', rect);
    let res = wx.getWindowInfo()
    const pages = getCurrentPages();
    let isShowHome = false
    console.log(pages)
    if (pages.length == 1 && pages[0].route != 'pages/home/home') {
      isShowHome = true
    } else {
      isShowHome = false
    }
    this.setData({
      innerPaddingRight: `padding-right:${res.windowWidth - rect.left}px`,
      leftWidth: `width:${res.windowWidth - rect.left}px`,
      // navBarHeight: rect.bottom + rect.top  - res.statusBarHeight,  //84px
      navBarHeight: rect.bottom - rect.top + (rect.top - res.statusBarHeight) * 2, //40px
      statusBarHeight: res.statusBarHeight, //44px
      isShowHome
    })


  },
  /**
   * 组件的方法列表
   */
  methods: {
    _showChange(show) {
      const animated = this.data.animated
      let displayStyle = ''
      if (animated) {
        displayStyle = `opacity: ${show ? '1' : '0'};transition: opacity 0.5s;`
      } else {
        displayStyle = `display: ${show ? '' : 'none'}`
      }
      this.setData({
        displayStyle
      })
    },
    back() {
      const data = this.data
      if (data.delta) {
        wx.navigateBack({
          delta: data.delta
        })
      }
      this.triggerEvent('back', {
        delta: data.delta
      }, {})
    },
    goHome() {
      wx.reLaunch({
        url: '/pages/home/home',
      })
    }
  }
})